<template>
  <el-table-column label="状态" prop="onlineStatus" min-width="150">
    <template #default="scope">
      <el-switch
          v-model="scope.row.onlineStatus"
          @click="switchStatus(scope.row)"
          :before-change="() => beforeStatusChange(scope.row)"
          inline-prompt
          :active-value="1"
          :inactive-value="0"
          active-text="上架"
          inactive-text="下架">
      </el-switch>
    </template>
  </el-table-column>
</template>

<script setup lang="ts">
import {IStoreProductRow} from "@/api/modules/pointsMall";

const emits = defineEmits(['status-change'])
const props = defineProps<{
  beforeChange: (row: IStoreProductRow) => Promise<boolean>
}>()

const switchStatus = (row: IStoreProductRow) => {
  emits('status-change', row)
}

const beforeStatusChange = (row: IStoreProductRow) => {
  if (!props.beforeChange) {
    return Promise.resolve(true)
  }

  return props.beforeChange(row)
}
</script>
